﻿<%@ Page 
    Language="C#" 
    AutoEventWireup="true" 
    CodeFile="Default.aspx.cs" 
    Inherits="_Default" %>

<%@ Register 
    assembly="Gaia.Ajax.UI.WebControls.VideoPlayers" 
    namespace="Gaia.Ajax.UI.WebControls.VideoPlayers" 
    tagprefix="gaia" %>

<%@ Register 
    assembly="Gaia.WebWidgets" 
    namespace="Gaia.WebWidgets" 
    tagprefix="gaia" %>
    
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Gaia Flow Player C# sample</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <h1>Gaia Flow Player C# sample</h1>
    <p>All Video Logic in this sample is written 100% in C#. No custom javascript required to make this work. 
    The last video in the list has two CuePoints attached at 5 seconds and 10 seconds.</p>
    <h3><gaia:Label ID="lblCurrentVideo" runat="server"></gaia:Label></h3>
    
    <gaia:DropDownList 
        ID="drpVideos" 
        runat="server" 
        AutoPostBack="true" 
        OnSelectedIndexChanged="UpdatePlayer" 
        Width="250px" >
    </gaia:DropDownList>
    
    <gaia:CheckBox 
        ID="chkAutoPlay" 
        runat="server" 
        AutoPostBack="true" 
        OnCheckedChanged="UpdatePlayer" 
        Text="AutoPlay Video" 
        Checked="false" />
    
    <gaia:CheckBox 
        ID="chkControlsOverVideo" 
        runat="server" 
        AutoPostBack="true" 
        OnCheckedChanged="UpdatePlayer" 
        Text="Overlay Controls over video" 
        Checked="true" />
    
    <gaia:CheckBox 
        ID="chkAllowFullscreen" 
        runat="server" 
        AutoPostBack="true" 
        OnCheckedChanged="UpdatePlayer" 
        Text="Allow Fullscreen" 
        Checked="true" />
    
    <div style="height: 25px;"></div>
    
    <gaia:FlowPlayer 
        ID="flowplayer"
        runat="server"
        AutoPlay="false"
        OnPlayerStateChanged="flowplayer_StateChanged"
        OnCuePointReached="flowplayer_CuePointReached"
        OnVideoClipFinished="flowplayer_VideoClipFinished"
        ControlsOverVideo="true"
        Width="480"
        Height="320"
        InitialVolumePercentage="40"
        InitScale="Scale"
        ShowFlashMenu="false"
        ShowFullScreenButton="true"
        ShowMenu="true"
        ShowMuteVolumeButton="true"
        ShowScrubber="true"
        ShowStopButton="true"
        ShowVolumeSlider="true"
        AlternativeContent=""/>
    
    <gaia:LinkButton ID="lnkPlayVideo" runat="server" Text="Play Video" OnClick="PlayVideo" ></gaia:LinkButton>
    
    <gaia:Panel 
        ID="pnlModal" 
        Visible="false" 
        runat="server" 
        style="z-Index: 500; border: 2px solid black; background-color: white; width: 300px; height: 300px; left: 200px; top: 200px; position: absolute;">
        
        <h3>CuePoint reached at 10 seconds</h3>
        <p>At this CuePoint, we stopped the Video on the server with player.Stop(); and opened this modal Panel.</p>
        Click <gaia:LinkButton ID="lnkClosePanel" runat="server" Text="here" OnClick="ClosePanel" ></gaia:LinkButton> to close the Panel and resume the window. 
        
        <p>In this Panel you could for example pop-up a quiz and ask the users to populate a form if you wanted.</p>
        
    </gaia:Panel>
    
    <gaia:Label 
        ID="lblStatus" 
        runat="server">
    </gaia:Label>
    
    <p><em>The GaiaFlowPlayer is GPL and uses these licensed works</em></p>
    <ul>
        <li><a href="http://gaiaware.net">Gaia Ajax 3.0 Glory</a></li>
        <li><a href="http://flowplayer.org/">FlowPlayer.org</a></li>
        <li><a href="http://www.codeproject.com/KB/recipes/JSON.aspx">http://www.codeproject.com/KB/recipes/JSON.aspx</a></li>
    </ul>
    
    </div>
    </form>
</body>
</html>
